<layout name="page" />
<block name="content">
	<link rel="stylesheet" href="layui/css/kf.css" media="all">
	<div class="row x1 main wrap" style="padding:0px;">
		{:widget('page_header/simple',array('name'=>'红包发放记录'))}
		<div class="sub">
			<div class="table box">
				<ul>
					<li class="thead">
						<span class="w16">活动名称</span>
						<span class="w10">发送者</span>
						<span class="w10">金额</span>
						<span class="w16 x1">祝福语</span>
						<span class="w10">操作人</span>
						<span class="w10">时间</span>
						<span class="w10">操作</span>
					</li>
					<foreach name="list" val='val'>
						<li class="tbody">
							<span class="w16">{$val.act_name}</span>
							<span class="w10">{$val.send_name}</span>
							<span class="w10">{$val.amount}</span>
							<span class="w16 x1">{$val.wishing}</span>
							<span class="w10">{$val.user_name}</span>
							<span class="w10">{$val.create_time}</span>
							<span class="w10" ><a onclick="read({$val.talk_id})"  href="#">查看会话</a></span>
						</li>
					</foreach>
				</ul>
			</div>
		</div>
		<if condition="!empty($list)">
			{$page}
		</if>
	</div>
</block>
<block name="js">
	<script type="text/javascript">
		layui.use(['global', 'upload', 'badge'], function() {
			var badge=layui.badge;	
			var fn = {
				index : function() {
					window.open('{:url("index")}', '_self');
				},
				todo : function() {
					window.open('{:url("todo")}', '_self');
				},
				finish : function() {
					window.open('{:url("finish")}', '_self');
				},
				hb_list : function() {
					window.open('{:url("hb_list")}', '_self');
				},
				read : function(talk_id) {
					winopen('{:url("read_talk")}' + '&id=' + talk_id, 560, 470);
				},
				send_hb : function() {
					$id = $('#talk_list .chat-user.active').attr('data');
					if ($id == undefined) {
						layer.msg('请选择人员');
						return false;
					}
					winopen('{:url("send_hb")}', 560, 470);
				},
				play_audio : function(obj) {
					var media_id = $(obj).attr('data-src');
					winopen("{:url('voice')}&media_id=" + media_id, 560, 470);
				},
				play_video : function(obj) {
					var media_id = $(obj).attr('data-src');
					winopen("{:url('video')}&media_id=" + media_id, 560, 470);
				},
				send_image : function() {
					talk_id = $('#talk_list .active').attr('data');
					var options = {
						elem : '#send_image',
						url : '{:url("send_image")}&id=' + talk_id,
						success : function(ret) {
							show_data(talk_id);
						},
						ext : 'jpg'
					};
					layui.upload(options);
				}
			};
			win_exp(fn);

			$('#msg_box').on('keydown', function() {
				if (event.ctrlKey && event.keyCode == 13) {
					$id = $('#talk_list .chat-user.active').attr('data');
					if ($id == undefined) {
						layer.msg('请选择人员');
						return false;
					}
					var vars = {
						'id' : $id,
						'content' : this.value
					};
					send_ajax('{:url("send_text")}', vars, function(ret) {
						if (ret.errcode == 0) {
							$this = $('#talk_list .active');
							talk_id = $this.attr('data');
							show_data(talk_id);
						} else {
							layer.msg(ret.errmsg);
						};
					});
				}
			});

			$('#talk_list .chat-user').on('click', function() {
				$('#talk_list .chat-user.active').removeClass('active');
				$this = $(this);
				$this.addClass('active');
				talk_id = $this.attr('data');
				show_data(talk_id);
			});

			function show_data(talk_id) {
				var vars = {};
				vars.id = talk_id;
				vars.is_read = true;
				send_ajax('{:url("get_talk_content")}', vars, function(ret) {
					html = '';
					for (s in ret) {
						if (ret[s].action_type == 'receive') {
							var content = '';
							if (ret[s].msg_type == 'text') {
								content = ret[s].content;
							}
							if (ret[s].msg_type == 'image') {
								content = '<img class="image" src="uploads/mp/image/' + ret[s].media_id + '.jpg" style="max-height:600px;max-width:600px;">';
							}
							if (ret[s].msg_type == 'location') {
								$latlng = JSON.parse(ret[s].location);
								content = ret[s].label + '<br><iframe class="map" src="{:url("map")}&latlng=' + $latlng.x + ',' + $latlng.y + '" style="min-height:450px;width:600px;"></iframe>';
							}
							if (ret[s].msg_type == 'voice') {
								$latlng = JSON.parse(ret[s].location);
								content = '<div class="voice" onclick="play_audio(this)" data-src="' + ret[s].media_id + '"><i class="fa fa-wifi fa-rotate-90" aria-hidden="true"></i>音频</div>';
							}
							if (ret[s].msg_type == 'video') {
								$latlng = JSON.parse(ret[s].location);
								content = '<div class="video" onclick="play_video(this)" data-src="' + ret[s].media_id + '"><img src="uploads/mp/video/' + ret[s].thumb_media_id + '.jpg"><i class="fa fa-play-circle-o" ></i></div>';
							}
							html += parse_msg_receive(ret[s].nickname, ret[s].create_time, ret[s].from_user_name, content);
						} else {
							var content = '';
							if (ret[s].msg_type == 'text') {
								content = ret[s].content;
							}
							if (ret[s].msg_type == 'image') {
								content = '<img class="image" src="' + ret[s].pic_url + '" style="max-height:600px;max-width:600px;">';
							}
							html += parse_msg_send(ret[s].user_name, ret[s].create_time, './uploads/avatar/' + ret[s].emp_no + '.png', content);
						}
					}
					$("#content_wrap").html(html);
					setTimeout(function() {
						$('#content_wrap').scrollTop(100000);
					}, 200);
				});
			}

			//解析消息发送样式
			function parse_msg_receive(user, time, avatar, message) {
				var _html = '<div class="chat-message">';
				_html += '<div class="message-user">';
				_html += '<img class="message-avatar" src="uploads/mp/avtar/' + avatar + '.jpg" alt="">';
				_html += '<span class="message-date"> ' + user + '&nbsp;&nbsp;&nbsp;' + int_to_date(time, 'MM-dd hh:mm:ss') + '</span>';
				_html += '</div>';
				_html += '<div class="message">' + message + '</div></div>';

				return _html;
			}

			function parse_msg_send(user, time, avar, message) {
				var _html = '<div class="chat-message send">';
				_html += '<div class="message-user">';
				_html += '<span class="message-date"> ' + int_to_date(time, 'MM-dd hh:mm:ss') + ' ' + user + '</span>';
				_html += '<img class="message-avatar" src="' + avar + '" alt="">';
				_html += '</div>';
				_html += '<div class="message">' + message + '</div></div>';

				return _html;
			}

			function new_msg(msg) {
				badge.get_badge_count();				
			}

			function new_todo(msg) {
				badge.get_badge_count();
			}

			var ws = {
				count : 0,
				retry : 10,
				server : document.domain,
				port : 1001,
				inited : 0,
				socket : null,
				bind_url : '{:url("bind")}',
				connect : function() {
					ws.socket = new WebSocket('ws://' + ws.server + ':' + ws.port);
					ws.socket.onopen = function() {
						console.log('1-> 握手');
						console.log('2-> 发送初始化');
						var request = {};
						request.type = 'init';
						ws.send(request);
					};
					ws.socket.onmessage = function(ret) {
						var msg = JSON.parse(ret.data);
						console.log(msg);
						switch(msg.type) {
						case 'init':
							ws.init(msg);
							return;

						case 'online':
							ws.online(msg);
							return;

						case 'new_todo':
							new_todo(msg);
							console.log(msg);
							return;

						case 'new_msg':
							new_msg(msg);
							return;

						case 'notify':
							return;

						case 'message':
							console.log(msg);
							return;
						}
					};
					ws.socket.onclose = function() {
						ws.count++;
						if (ws.retry > ws.count) {
							ws.connect();
						}
					};
					ws.socket.onerror = function() {
						ws.count++;
						if (ws.retry > ws.count) {
							ws.connect();
						};
					};
				},
				send : function(data) {
					console.log(data);
					if (this.socket && this.socket.readyState == 1) {
						this.socket.send(JSON.stringify(data));
					}
				},
				send_heat_beat : function() {
					var request = {};
					request.type = 'ping';
					if (this.socket && this.socket.readyState == 1) {
						this.socket.send(JSON.stringify(request));
					}
				},
				init : function(ret) {
					console.log('3-> 接受client_id');
					console.log(ret);
					$.post(ws.bind_url, ret, function(ret) {
						console.log(ret);
					});

					setInterval(function() {
						ws.send_heat_beat();
					}, 12000);
				},
				online : function(ret) {
					console.log(ret);
				}
			};

			ws.server = document.domain;
			ws.port = 8282;
			ws.connect();

		});
	</script>
</block>